import deviceApi from "@/api/device";
import devicemgApi from "@/api/device";
import AddNew from "@/views/terminal/devicemg/form/editForm";
import { mapGetters } from 'vuex';
import VueElementLoading from 'vue-element-loading';
import { hasPermissionPoint } from "@/utils/permission";

const components = {
    AddNew,
    VueElementLoading
};

const data = function () {
    return {
        fpojo: {
            tName: "",
            tSerialNumber: "",
            tRemarks: ""
        },
        backup: {
            tName: "",
            tSerialNumber: "",
            tRemarks: ""
        },
        list: [],
        total: 0, //总记录数
        currentPage: 1, //当前页码
        pageSize: 5, // 每页显示10条数据
        searchMap: {
            deviceName: ""
        },
        radio: null, // 如果使用单选框，定义一个model值
        currentSelectItem: {}, //当前选中的值
        // value: this.$store.state.tipstate.value
        clicksum: 0,
        editdataDialog: false, //新增、编辑窗口
        isEdit: false, // 是否被编辑
        isDelete: false, // 是否删除
        title: "", // 弹窗标题
        deletedialog: false // 提示删除弹窗
    };
};

const computed = {
    ...mapGetters([
        'name',
        'roles'
    ])
};

const watch = {
    // $router(to, from) {
    //   if (this.value !== this.$store.state.value) {
    //     this.value = this.$store.state.value;
    //   }
    // }
};

const methods = {
    btnshow(point) {
        return hasPermissionPoint(point);
    },
    // 当每页显示条数改变后，被触发，val是最新的显示条数
    handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
        this.pageSize = val;
        this.searchBydeviceName();
    },
    // 当页码改变后，被触发，val是最新的页码
    handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        this.currentPage = val;
        this.searchBydeviceName();
    },
    fetchData() {
        // 调用分页查询
        deviceApi.searchdevice(this.currentPage, this.pageSize).then(resp => {
            this.list = resp.data.rows;
            this.total = resp.data.total;
            console.log(resp);
        });
    },
    searchdevice() {
        this.currentPage = 1;
        this.searchBydeviceName();
    },
    // 按照设备名称进行查询
    searchBydeviceName() {
        var vm = this.$store;
        vm.commit('updateLoading', true);
        console.log('是否开启加载', this.$store.state.elementloading.vueElementLoading);
        deviceApi
            .searchBydeviceName(
                this.searchMap.deviceName,
                this.currentPage,
                this.pageSize
            )
            .then(resp => {
                this.list = resp.data.rows;
                this.total = resp.data.total;
                if (resp.data.rows != null || resp.data.rows != undefined) {
                    vm.commit('updateLoading', false);
                    console.log('是否开启加载', this.$store.state.elementloading.vueElementLoading)
                }
                console.log(resp);
            });
    },
    handleSelectionChange(row) {
        console.log(row);
        this.currentSelectItem = row;
    },
    chooseone(row) {
        this.radio = row.id;
        this.fpojo = row;
        this.backup = row;
        if (this.clicksum == 0) {
            this.$notify({
                title: "温馨提示",
                message: "双击数据行可以查看详情信息哦！",
                type: "success",
                duration: 1000
            });
        }
        this.clicksum += 1;
    },
    openDetails(row) {
        console.log(row.tSerialNumber);
        this.$store.state.devicedata.tSerialNumber = row.tSerialNumber;
        this.$router.push({
            name: "devicedata",
            params: {
                tSerialNumber: row.tSerialNumber
            }
        });
    },

    // 打开新增弹窗
    openNew() {
        this.isEdit = false;
        this.opendialog(this.isEdit);
    },

    // 关闭弹窗
    closeEditor() {
        this.editdataDialog = false;
        this.fpojo = {
            tName: "",
            tSerialNumber: "",
            tRemarks: ""
        };
        this.searchBydeviceName();
    },

    // 提交表单
    addData() {
        this.$refs.feditForm.validateForm();
    },

    // 修改操作
    handleEdit(id) {
        if (id != null && id != "") {
            this.isEdit = true; // 切换为修改状态
            this.opendialog(this.isEdit);
            // this.fpojo
        } else {
            this.$message({
                message: "请选择需要修改的设备哦！",
                type: "warning"
            });
        }
    },

    // 删除操作
    handleDelete(id) {
        if (id != null && id != "") {
            this.$confirm("此操作将永久删除该设备, 是否继续?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    deviceApi.deleteDevice(id).then(resp => {
                        if (resp.data.flag) {
                            this.$message({
                                message: "删除设备成功",
                                type: "success"
                            });
                            this.searchBydeviceName();
                            this.radio = '';
                        } else {
                            this.$message({
                                message: "删除设备失败",
                                type: "warning"
                            });
                        }
                    });
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消删除"
                    });
                });
            // this.deletedialog = true;
        } else {
            this.$message({
                message: "请选择需要删除的设备哦！",
                type: "warning"
            });
        }
    },

    // 打开窗口
    opendialog(e) {
        if (e) {
            this.fpojo = this.backup;
            this.title = "修改设备";
        } else {
            this.title = "新增设备";
            this.fpojo = {
                tName: "",
                tSerialNumber: "",
                tRemarks: ""
            };
        }
        this.editdataDialog = true;
        // 等渲染完成之后再清除校验规则
        this.$nextTick(() => {
            this.$refs.feditForm.cancelFieldValidate("seditForm");
        });
    },

    // 取消删除
    cancleDelete() {
        this.deletedialog = false;
    },

    // 确认删除
    // ensureDelete(id) {
    //   deviceApi.deleteDevice(id).then(resp => {
    //     if (resp.data.flag) {
    //       this.$message({
    //         message: "删除设备成功",
    //         type: "success"
    //       });
    //     } else {
    //       this.$message({
    //         message: "删除设备失败",
    //         type: "warning"
    //       });
    //     }
    //   });
    //   this.deletedialog = false;
    //   this.searchBydeviceName();
    // },

    // 关闭之前的回调
    handleDialogClose() {
        this.searchBydeviceName();
        this.editdataDialog = false;
    }
};

function created() {
    // 初始化获取列表数据
    this.searchBydeviceName();
};




export default {
    data,
    components,
    computed,
    watch,
    methods,
    created,
}